<template>
	<view class="">
		
		<view class="bcg">
			<image src="../../static/mine/bcg.png" mode=""></image>
		</view>
		<view class="main">
			<view class="top">
				<view class="head">
					<image v-if="!headimgurl" src="../../static/mine/head.png" mode=""></image>
					<image v-if="headimgurl" :src="headimgurl" mode=""></image>
				</view>
				<view class="denglu">
					<view class="username">
						{{name}} 您好，等您很久了!
					</view>
					<!-- <view class="denglu_btn">
						立即登录
					</view> -->
				</view>
			</view>
			<view class="bottom">
				<view class="block" @click="goMyApply">
					<!-- <view class="number">4</view> -->
					<view class="name">我的申请</view>
				</view>
				<view class="block" @click="goPaymentOrder">
					<!-- <view class="number">3</view> -->
					<view class="name">我的还款</view>
				</view>
				<view class="block" @click="goMyOrder">
					<!-- <view class="number">1</view> -->
					<view class="name">我的订单</view>
				</view>
				<view class="block" @click="goPaymentHistory">
					<!-- <view class="number">2</view> -->
					<view class="name">还款记录</view>
				</view>
			</view>
		</view>
		<view class="adver" @click="goShare">
			<image src="../../static/mine/adver.png" mode=""></image>
		</view>
		<view class="item">
			<view class="icon">
				<image src="../../static/mine/icon_01.png" mode=""></image>
			</view>
			<view class="icon_text">
				我的好友
			</view>
			<view class="right">
				<image src="../../static/mine/right.png" mode=""></image>
			</view>
		</view>
		<view class="item">
			<view class="icon">
				<image src="../../static/mine/icon_02.png" mode=""></image>
			</view>
			<view class="icon_text">
				资料完善
			</view>
			<view class="right">
				<image src="../../static/mine/right.png" mode=""></image>
			</view>
		</view>
		<view class="item">
			<view class="icon">
				<image src="../../static/mine/icon_03.png" mode=""></image>
			</view>
			<view class="icon_text">
				前往合伙人中心
			</view>
			<view class="right">
				<image src="../../static/mine/right.png" mode=""></image>
			</view>
		</view>
		<view class="item">
			<view class="icon">
				<image src="../../static/mine/icon_04.png" mode=""></image>
			</view>
			<view class="icon_text">
				我的消息
			</view>
			<view class="news">
				0条消息未读
			</view>
			<view class="right">
				<image src="../../static/mine/right.png" mode=""></image>
			</view>
		</view>
		<view class="item">
			<view class="icon">
				<image src="../../static/mine/icon_05.png" mode=""></image>
			</view>
			<view class="icon_text">
				平台使用说明
			</view>
			<view class="right">
				<image src="../../static/mine/right.png" mode=""></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				a: '',
				name:'张三',
				headimgurl:'https://thirdwx.qlogo.cn/mmopen/icRTTHqV9awqC4cnxQKRArtCxYpjJyVehnaLricPcehobV2qftgAl4InohuD7e2lIhVO4o82TzUHlNwicjh4epuiaKoJrzwNrIPt/132',
			}
		},
		onShow() {
			this.getInfo();
		},
		onLoad() {
			this.getInfo();
		},
		methods: {
			getInfo(){
				console.log('获取头像')
				console.log(JSON.parse(uni.getStorageSync("zs_user_info")))
				console.log((JSON.parse(uni.getStorageSync("zs_user_info"))).headimgurl)
				this.headimgurl = (JSON.parse(uni.getStorageSync("zs_user_info"))).headimgurl;
				this.name = (JSON.parse(uni.getStorageSync("zs_user_info"))).nickname
				console.log('===========================1');
				console.log(this.headimgurl);
				console.log('===========================2');
			},
			goShare: function() {
				uni.navigateTo({
					url: '/pages/mine/share'
				});
			},
			goPaymentOrder: function() {
				uni.navigateTo({
					url: '/pages/order/paymentOrder'
				});
			},
			goPaymentHistory: function() {
				uni.navigateTo({
					url: '/pages/order/repaymentHistory'
				});
			},
			goMyApply: function() {
				uni.navigateTo({
					url: '/pages/mine/myApply'
				})
			},
			goMyOrder: function() {
				uni.navigateTo({
					url: '/pages/mine/myOrder'
				})
			}
		},
	}
</script>

<style>
	.bcg {
		width: 750rpx;
		height: 100rpx;
		overflow: hidden;
	}

	.bcg image {
		width: 750rpx;
		height: 200rpx;
		z-index: -1;
	}

	.main {
		width: 690rpx;
		padding: 30rpx 0;
		/* height:350rpx; */
		background: rgba(255, 255, 255, 1);
		box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1);
		border-radius: 10rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;
		margin-top: -80rpx;
		z-index: 1;
	}

	.main .top {
		display: flex;
	}

	.main .top .head {
		margin: 15rpx;
		width: 150rpx;
		height: 150rpx;
		margin-right: 20rpx;
		border-radius: 50%;
		overflow: hidden;
	}

	.main .top .head image {
		width: 150rpx;
		height: 150rpx;
	}

	.main .top .denglu {
		margin-top: 50rpx;
	}

	.main .top .denglu .username {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
		margin-bottom: 20rpx;
		margin-top: 20rpx;
	}

	.main .top .denglu .denglu_btn {
		width: 160rpx;
		height: 44rpx;
		background: rgba(72, 118, 228, 1);
		border-radius: 22rpx;
		color: #FFFFFF;
		font-size: 12px;
		text-align: center;
		line-height: 44rpx;
	}

	.bottom {
		display: flex;
		margin-top: 15px;
	}

	.bottom .block {
		width: 25%;
		text-align: center;
	}

	.bottom .block .number {
		color: #4876E4;
		font-size: 40rpx;
	}

	.bottom .block .name {
		color: #666666;
		font-size: 24rpx;
	}

	.adver {
		width: 690rpx;
		height: 198rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;
		margin-top: 40rpx;
		margin-bottom: 8px;
	}

	.adver image {
		display: block;
		width: 100%;
		height: 100%;
	}

	.item {
		width: 690rpx;
		margin: 0 30rpx;
		display: flex;
		padding: 18px 0;
		border-bottom: 1rpx solid #F2F2F2;
	}

	.item .icon {
		width: 44rpx;
		height: 44rpx;
		margin-right: 10px;
	}

	.item .icon image {
		width: 44rpx;
		height: 44rpx;
	}

	.item .icon_text {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.item .right {
		position: absolute;
		right: 0;
		margin-right: 30rpx;
		width: 18rpx;
		height: 30rpx;
	}

	.item .right image {

		width: 18rpx;
		height: 30rpx;
	}

	.item .news {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: rgba(153, 153, 153, 1);
		position: absolute;
		line-height: 50rpx;
		right: 0;
		margin-right: 70rpx;
	}
</style>
